<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.css"/>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/swiper.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			.major-box{
				margin: 0.625rem 0rem;
				padding: 0.625rem 1rem;
				background-color: white;
			}
			.major-box .title{
				font-weight: bold;
			}
			.major-box .major-item{
				display: flex;
				flex-wrap: wrap;
				justify-content: flex-start;
				align-items: flex-start;
			}
			.major-box .major-item>div{
				border-radius: 0.325rem;
				margin-top: 0.625rem;
				margin-right: 0.625rem;
				font-size: 0.875rem;
				width: 5rem;
				text-align: center;
				background-color: #1E9FFF;
				color: white;
			}
			.major-box .major-item>img{
				width: 50%;
				margin-top: 0.625rem;
				border-radius: 0.375rem;
			}
		</style>
	</head>
	<body>
	<header>
		<div class="logo-box">
			<div class="logo-name"></div>
			<div class="slogan"></div>
		</div>
		<div class="logo-img">
			<img src="img/true.jpg" >
		</div>
	</header>
		<div class="navbar-box">
			<ul class="navbar">
				<li><a href="index.html">首页</a></li>
				<li><a href="jianjie.html">简介</a></li>
				<li><a href="major.html" class="active">专业</a></li>
				<li><a href="shizi.html">师资</a></li>
				<li><a href="huanjing.html">环境</a></li>
				<li><a href="jiuye.html">就业</a></li>
				<li><a href="xinwen.html">新闻</a></li>
				<li><a href="wenda.html">问答</a></li>
			</ul>
		</div>
		<div class="swiper-container" id="lunbo">
		  <div class="swiper-wrapper">
		    <!-- <div class="swiper-slide"><img src="img/nature-1.jpg" ></div>
		    <div class="swiper-slide"><img src="img/nature-2.jpg" ></div>
		    <div class="swiper-slide"><img src="img/nature-3.jpg" ></div>
		    <div class="swiper-slide"><img src="img/nature-4.jpg" ></div>
		    <div class="swiper-slide"><img src="img/nature-5.jpg" ></div>
		    <div class="swiper-slide"><img src="img/nature-6.jpg" ></div>
		    <div class="swiper-slide"><img src="img/nature-7.jpg" ></div> -->
		  </div>
		  <!-- Add Arrows -->
		  <!-- <div class="swiper-button-next"></div>
		  <div class="swiper-button-prev"></div> -->
		</div>
		<div id="zhuanye">
			<!-- <div class="major-box">
				<div class="title">软件工程专业群</div>
				<div class="major-item">
					<div>软件开发</div>
					<div>大数据开发</div>
					<div>数据运维</div>
					<div>软件测试</div>
					<img src="img/nature-3.jpg" >
				</div>
			</div> -->
		</div>
		<footer>
			<div class="" style="padding: 0rem 0.625rem;">
				<div id="address"></div>
				<div><img src="" id="qrcode" ></div>
			</div>
			<div id="beian" style="text-align: center;font-size: 0.75rem;display: block;color: #ccc;"></div>
		</footer>
<!-- 底部导航 -->
		<div id="fixBottom">
			<ul>
				<li class="telzixun"><a href="tel:10000" id="tel"><img src="img/tel.png" ><div>电话咨询</div></a></li>
				<!-- <li class="baoming"><a href="tencent://message/?uin=1014167202&Site=在线QQ&Menu=yes"><img src="img/msg.png"><div>在线报名</div></a></li> -->
				<li class="baoming"><a href="leavemsg.html"><img src="img/msg.png"><div>在线报名</div></a></li>
				<li class="feezixun"><a href="chat.html"><img src="img/qq.png" ><div>报名咨询</div></a></li>
				<li class="feezixun"><a href="chat.html"><img src="img/fee.png" ><div>学费咨询</div></a></li>
				<!-- <li class="qqzixin"><a href="https://wpa1.qq.com/JEFqRGvh?_type=wpa&qidian=true"><img src="img/qq.png" ><div>QQ咨询</div></a></li>
				<li class="feezixun"><a href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes"><img src="img/fee.png" ><div>学费咨询</div></a></li> -->
			</ul>
		</div>
	</body>
	<script src="js/config.js" type="text/javascript" charset="utf-8"></script>
	<script>
	getLunbo("major");
	$.ajax({
		url:`${HOST}/h5/majors`,
		success: (res) => {
			console.log(res);
			for (let i = 0; i < res.data.length; i++) {
				let s=`<div class="major-box"><div class="title">${res.data[i].mtname}</div>
				<div class="major-item">`;
				for (let j = 0; j < res.data[i].majors.length; j++) {
					s+=`<div>${res.data[i].majors[j].mjname}</div>`;
				}
				s+=`<img src="${HOST}/upload/${res.data[i].mtimg}" >`;
				s+=`</div>
				</div>`;
				$("#zhuanye").append(s);
			}
			
		}
	})
	</script>
</html>
